<template>
	<view>
	<view class="flex align-center justify-between px-2">
		<text class="font-md">热门分类</text>
		<view class="flex align-center font text-secondary animate__animated " hover-class="animate__jello" @click="openMore">
			更多<text class="iconfont icon-jinru"></text>
		</view>
	</view>
	<view class="flex align-center py-1  px-3 border-bottom ">
		<view class="border rounded bg-light mx-1 animate__animated "style="padding-left: 8rpx; padding-right: 8rpx;"hover-class="animate__jello" v-for="(item,index) in hotCate" :key="index" @click="openDetail(item)">
			{{item.name}}
		</view>
		</view>
	</view>
</template>

<script>
	export default{
		props:['hotCate'],
		methods:{
			openMore(){
				uni.navigateTo({
					url:'../../pages/topic-nav/topic-nav'
				})
			},
			openDetail(item){
				console.log('打开话题分类页')
			}
		}
	}
</script>

<style>
</style>
